import 'package:cook_dinner/pages/create_cook/create_cook_page/cook_data.dart';
import 'package:cook_dinner/pages/create_cook/create_cook_page/cook_food.dart';
import 'package:cook_dinner/pages/create_cook/create_cook_page/cook_move.dart';
import 'package:cook_dinner/widgets/custom_appbar.dart';
import 'package:flutter/material.dart';
import 'package:cook_dinner/config/include.dart';

const List<String> tabText = ['食谱信息', '使用材料', '烹饪步骤'];

class CreateCook extends StatefulWidget {
  const CreateCook({Key? key}) : super(key: key);

  @override
  State<CreateCook> createState() => _CreateCookState();
}

class _CreateCookState extends State<CreateCook> {
  int _current = 0;

  final List<Widget> _page = [
    const CookData(),
    const CookFood(),
    const CookMove(),
  ];

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.translucent,
      onTap: () {
        FocusScope.of(context).unfocus();
      },
      child: Scaffold(
        backgroundColor: Colors.white,
        resizeToAvoidBottomInset: true,
        appBar: AppBarCustom(
          '创建食谱',
          height: 84.rpx + HYSizeFit.statusHeight,
          actions: [
            InkWell(
              child: Center(
                child: Text(
                  '预览',
                  style: TextStyle(
                      color: const Color(0xffFCC302), fontSize: 16.rpx),
                ),
              ),
            ),
            SizedBox(width: 30.rpx),
          ],
          bottom: PreferredSize(
            preferredSize: Size.fromHeight(54.rpx),
            child: Padding(
              padding: EdgeInsets.symmetric(horizontal: 48.rpx),
              child: Container(
                width: double.infinity,
                height: 54.rpx,
                padding: EdgeInsets.symmetric(horizontal: 8.rpx),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(27.rpx),
                  color: Colors.white,
                  boxShadow: [
                    BoxShadow(
                      offset: Offset(0, 2.rpx), // 垂直偏移4px，水平偏移0
                      blurRadius: 4.rpx, // 模糊半径20px
                      spreadRadius: 0, // 扩展半径0，保持阴影大小不变
                      color: const Color(0xFF000000)
                          .withOpacity(0.08), // 颜色设置为透明度较低的黑色
                    ),
                  ],
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: List.generate(
                    tabText.length,
                    (index) {
                      return topTab(
                        tabText[index],
                        type: _current == index,
                        onTap: () {
                          setState(() {
                            _current = index;
                          });
                        },
                      );
                    },
                  ),
                ),
              ),
            ),
          ),
        ),
        body: _page[_current],
      ),
    );
  }

  // 按钮
  Widget topTab(title, {bool? type = false, onTap}) {
    return InkWell(
      onTap: onTap,
      child: Container(
        width: 100.rpx,
        height: 38.rpx,
        alignment: Alignment.center,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(19.rpx),
          color: type! ? const Color(0xffFCC302) : Colors.white,
        ),
        child: Text(
          title,
          style: TextStyle(
              color: type ? Colors.white : const Color(0xff636773),
              fontSize: 16.rpx),
        ),
      ),
    );
  }
}
